<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<!-- Header -->
<header data-am-widget="header"
	class="am-header am-header-default am-header-fixed">
	<div class="am-header-left am-header-nav">
		<a href="#left-link" data-am-offcanvas> <i
			class="am-header-icon am-icon-user"></i>
		</a>
	</div>
	<h1 class="am-header-title">产品分类</h1>
</header>

<!-- 侧边栏内容 -->
<div id="left-link" class="am-offcanvas">
	<div class="am-offcanvas-bar" style="background: #ffffff">
		<div class="am-offcanvas-content">
			<img class="am-circle am-center" style="margin-bottom: 10px"
				src="assets/img/mobile/default_user.jpg" width="100" height="100" />
			<c:if test="${empty mobileUser}">
				<a href="mobile/loginPage"
					class="am-btn am-btn-success am-btn-block am-radius"
					style="color: #ffffff">登录/注册</a>
			</c:if>
			<c:if test="${not empty mobileUser}">
				<button id="modifyPwdBtn" type="button"
					class="am-btn am-btn-default am-btn-block">
					用户：${mobileUser.mobile}<i class="am-icon-edit"
						style="margin-left: 5px"></i>
				</button>
				<hr data-am-widget="divider" style=""
					class="am-divider am-divider-default" />
				<a href="mobile/logOut"
					class="am-btn am-btn-danger am-btn-block am-radius"
					style="color: #ffffff">注销</a>
			</c:if>
		</div>
	</div>
</div>


<!-- main content -->
<div id="widgetList1" class="widget-list">
	<ul class="am-list m-widget-list">
		<c:forEach items="${categories}" var="category">
			<li><a class="category" data-code="${category.code}"
				data-name="${category.name}" href="javascript:void(0)"
				data-rel="accordion"> <span class="widget-name">${category.name}</span>
			</a></li>
		</c:forEach>
	</ul>
</div>


<script type="text/javascript">
	$(function() {

		$('#modifyPwdBtn').click(function() {
			location.href = "mobile/modifyPwdPage";
		});

		$('.category').click(
				function() {
					var categoryCode = $(this).attr('data-code');
					var categoryName = $(this).attr('data-name');
					location.href = 'mobile/selection/detail?categoryCode='
							+ categoryCode + '&categoryName='
							+ encodeURI(encodeURI(categoryName));
				});

	});
</script>